<template>
  <div class="driver-details">
    <div class="title">
      <span>
        <i class="el-icon-back" />
      </span>
      <span>返回</span>
      <h5>司机详情</h5>
    </div>

    <div class="body">
      <div class="top">
        <!-- 放两个组件 -->
        <span>基本信息</span>  <span>驾驶证信息</span>
      </div>
      <div class="center" />
      <div class="bottom">
        <el-button type="primary">编辑</el-button>
      </div>
    </div>

    <div class="foot">
      <span>江苏传智博客教育科技股份有限公司</span>
      <span>版权所有Copyright 2006-2022  All Rights Reserved</span>
      <span>苏ICP备16007882号-11</span>
    </div>
  </div>
</template>

<script>
export default {

}
</script>

<style scoped  lang="scss">
.title{
  display: flex;
  align-items: center;
  width: 100%;
  padding: 0px 45px 0px 25px;

    span {
      font-weight: 700;
      font-size: 16px;
    }

    h5 {
      margin-left: 20px;
    }
  }

  .body{
    margin-left: 20px;
    height: 580px;
    background-color: #fff;

    .top {
      margin-left: 30px;
      height: 85px;
      padding: 24px 37px;
      border-bottom: 1px solid #a4a4a4;
    }

    .center{
      height: 408px;
    }

    .bottom{
      display: flex;
      justify-content: center;
      border-top: 1px solid #a4a4a4;
      height: 87px;
      padding: 30px 0px 16px;
    }
  }

    .foot{
    position: absolute;
    left: 330px;
    bottom: 10px;
    font-size: 14px;
    color: #bac0cd;
    font-weight: 400;
  }

</style>
